<template>
  <div>
    <el-card class="bodyCard">
      <el-form :model="memberInfo">
        <el-col :span="12">
          <el-form-item label="會員名稱:">
            {{ memberInfo.memberName }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="手機號碼:">
            {{ memberInfo.phone }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="頭像:">
            <img :src="baseApi + memberInfo.avatar " height="30px" alt="">
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="會員生日:">
            {{ memberInfo.birthday }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="注冊時間:">
            {{ memberInfo.createdAt }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="會員性別:">
            {{ dict.label.gender[memberInfo.gender] }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="會員等級:">
            {{ memberInfo.memberLevel.nameCn }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="其他聯絡號碼:">
            {{ memberInfo.otherPhone }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="聯絡方式偏好:">
            {{ memberInfo.preferredContactWay }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="通知語言偏好:">
            {{ memberInfo.preferredLanguage }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="推薦人電話號碼:">
            {{ memberInfo.referredFriend }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="用戶來源:">
            {{ dict.label.sourceType[memberInfo.sourceType] }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="賬號是否啟用:">
            {{ dict.label.true_false[memberInfo.status] }}
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="會員微信:">
            {{ memberInfo.wechatId }}
          </el-form-item>
        </el-col>
      </el-form>
    </el-card>
  </div>
</template>
<script>
import member from '@/api/ums/member'
import { setTitle } from '@/utils/index'
import { mapGetters } from 'vuex'

export default {
  name: 'MemberDetail',
  dicts: ['gender', 'sourceType', 'true_false', 'sysStatus'],
  data() {
    return {
      memberInfo: null
    }
  },
  computed: {
    ...mapGetters(['baseApi'])
  },
  created() {
    this.getMember()
  },
  methods: {
    getMember() {
      const id = this.$route.query.id
      console.log(id)
      member.getOne(id).then(res => {
        if (res.code === 0) {
          this.memberInfo = res.data
          setTitle(`會員管理${this.memberInfo.memberName}:${this.memberInfo.phone}`)
        }
      })
    }
  }
}
</script>

<style scoped>
.bodyCard {
  width: 90%;
  height: 600px;
  margin: 50px 30px 30px 50px;
}
</style>
